<?xml version="1.0" encoding="UTF-8"?>
<!--
  Created by IntelliJ IDEA.
  User: Nikita
  Date: 03.02.13
  Time: 22:59
-->
<!DOCTYPE html
        PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
    <title>Events page</title>
    <h:outputStylesheet library="css" name="examples.css"/>
</h:head>

<h:body>
    <f:decorate template="templates/master_page_default.xhtml">
        <h2>Events</h2>
        <table class="example">
            <h:form prependId="false">
                <tr>
                    <td>Change event</td>
                    <td>
                        <h:selectOneListbox id="no_immed_listbox"
                                            value="#{events.selectedItem}"
                                            valueChangeListener="#{events.wordChanged}"
                                            validator="#{events.validationMethod}">
                            <c:selectItems value="#{events.options}"/>
                        </h:selectOneListbox>
                        <br/>
                        <h:inputText value="#{events.keyWord}" size="10"/>
                        <br/>
                        <h:commandButton action="#{events.action}" value="Submit"/>
                    </td>
                    <td>
                        <h:outputLabel value="#{events.selectionHistory}"/>
                    </td>
                </tr>
                <tr>
                    <td>Action event</td>
                    <td colspan="2">
                        <h:commandButton action="#{events.action}" actionListener="#{events.clean}" value="Clean"/>
                    </td>
                </tr>
            </h:form>
            <h:form prependId="false">
                <tr>
                    <td>Immediately change event</td>
                    <td>
                        <h:selectOneListbox id="immed_listbox"
                                            immediate="true"
                                            value="#{events.selectedItem}"
                                            valueChangeListener="#{events.wordChangedImmediate}"
                                            validator="#{events.validationMethod}">
                            <c:selectItems value="#{events.options}"/>
                        </h:selectOneListbox>
                    </td>
                    <td>
                        <h:inputText value="#{events.keyWord}" size="10"/>
                        <br/>
                        <h:outputText value="#{events.keyWord}"/>
                        <br/>
                        <h:commandButton action="#{events.action}" value="Submit keyword"/>
                    </td>
                </tr>

                <tr>
                    <td>Immediately action event</td>
                    <td>
                        <h:commandLink id="immed_commandLink"
                                       immediate="true"
                                       action="#{events.action}"
                                       actionListener="#{events.cleanImmediate}"
                                       value="Clean"/>
                    </td>
                    <td>
                        <h:selectOneListbox id="listbox_of_immed_commandlink"
                                            value="#{events.selectedItem}"
                                            validator="#{events.validationMethod}"
                                            valueChangeListener="#{events.wordChangedImmediate}">
                            <c:selectItems value="#{events.options}"/>
                        </h:selectOneListbox>
                    </td>
                </tr>
            </h:form>
        </table>
    </f:decorate>
</h:body>

</html>